@import "../../../css/global";

$rem: 7.5rem / 1125;

.status-bar {
  display: none;
}

.search-bar {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  right: 0;
  background: url(../../../img/status-bar-bg.png) top no-repeat;
  background-size: cover;
  .input-text {
    margin: 30 * $rem auto;
    background: #ffffff;
    width: 6.5rem;
    height: 108*$rem;
    border-radius: 40*$rem #{'/'} 36*$rem;
    padding: 0 28*$rem 0 40*$rem;
    border: .02rem solid #eeeeee;
    input {
      color: #000000;
      font-size: .24rem;
      &::placeholder {
        color: #bebebe;
        font-size: .24rem;
      }
    }
    .icon {
      width: 48*$rem;
      height: 48*$rem;
      margin-left: 30*$rem;
      &.icon-search {
        background: url("../../../img/search.png") center no-repeat;
        background-size: contain;
      }
      &.icon-clean {
        display: none;
        background: url("../../../img/zxd-icon-04@2x.png") center no-repeat;
        background-size: contain;
      }
      &.js_show {
        display: block;
      }
    }
  }
  &.scroll {
    background: #ffffff;
    .input-text {
      background: #eeeeee;
      input {
        background: #eeeeee;
        color: #414141;
        &::placeholder {
          color: #bebebe;
        }
      }
    }
  }
}
.banner-bg {
  background: #dfdfdf;
  .banner {
    height: 630 * $rem;
    width: 100%;
    overflow: hidden;
    position: relative;
    background: url("../../../img/default.png") center no-repeat;
    background-size: contain;
    .banList {
      @include full;
      li {
        @include full;
        opacity: 0;
        position: absolute;
        //transform: scale(0);
        //transition: transform 0.5s ease 0s, opacity 1.5s ease 0s;
        z-index: 1;
        &.active {
          opacity: 1;
          //transform: scale(1);
          z-index: 2;
        }
      }
    }
    .fomW {
      position: absolute;
      bottom: 0;
      z-index: 9;
      @include full-width;
      .jsNav {
        text-align: center;
        a {
          display: inline-block;
          background: #fff;
          width: 0.2rem;
          height: 0.04rem;
          margin: 0.2rem 0.06rem;
          &.current {
            background: #fc8f0f;
            cursor: pointer
          }
        }
      }
    }
  }
}
.scroll-container {
  overflow: scroll;
  .scroll-item {
    .list {
      background: #ffffff;
      .item {
        &:nth-child(1) {
          border-top: none;
        }
        padding: 39*$rem;
        border-top: 3*$rem solid #ededed;
        .title {
          font-size: 51*$rem;
          width: 702 * $rem;
          color: #000000;
          span {
            color: rgb(250, 20, 20);
            font-size: 51*$rem;
          }
        }
        .img {
          width: 345*$rem;
          min-height: 216*$rem;
        }
        .author, .date {
          font-size: 36*$rem;
          line-height: 36*$rem;
          color: #ababab;
          margin-top: .26rem;
        }
        .author {
          margin-right: .26rem;
        }
      }
    }
  }
}
